<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>客户管理-添加客户</title>
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/formSelects-v4.css">
	<link rel="stylesheet" href="/css/reset.css">
	<link rel="stylesheet" href="/css/index.css">
	<link rel="stylesheet" href="/css/client.css">
	<script src='/js/jquery-2.1.1.min.js'></script>
    <script src='/js/plugin/layui-v2.3.0/layui/layui.js'></script>
    <script src='/js/common.js'></script>
</head>
<style>
 ::-webkit-scrollbar-thumb {
  background:#a2a2a2; 
  border-radius: 10px;
  height:50%;
}
::-webkit-scrollbar{width:6px;}
body{
	overflow-y: scroll;
}
.date-input{
	padding-left:30px;
    background: url(/images/icon/rili_icon.png) no-repeat 10px center !important;
} 
</style>
<body style="padding-top:60px;box-sizing: border-box;">
	<div class="kb-out-box">
		<div class="kb-content my-locations-list">	
			<section class="kb-content-container clearfix" style="min-height: 500px;">
				<header class="nav-header">
					<div class="nav-section-header-title">	
					  填写客户信息
					</div>
				</header>
				<div class="crm-new-opp-progress-container">
					<div class="crm-new-opp-progress-bar" style="width:20%"></div>
				</div>
				<div class="kb-form-container" style="padding:30px 30px 95px 30px;">
					<div class="layui-tab-content">
						<form class="layui-form" id="client-form" >
						    <div class="layui-tab-item  layui-show">
						    		<div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label"><span class="must-fill">*</span>客户名称</label>
											    <div class="layui-input-block">
											      <input type="text" name="customerName" id="userName" lay-verify="userName" placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			</div>
						    		</div>	
						    		<div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">客户类型</label>
											    <div class="layui-input-block">
											      <input type="radio" name="customerType" value="0" title="直接客户" checked  lay-filter="usertype">
											      <input type="radio" name="customerType" value="1" title="代理人"  lay-filter="usertype">
											    </div>
											</div>
						    			</div>
						    		</div>	
					    			<div class="layui-row people-contact">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label"><span class="must-fill">*</span>联系人</label>
											    <div class="layui-input-block">
											      <input type="text" name="contactsName" id="userid"   lay-verify="peopleName" placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			
						    			</div>
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">电话</label>
											    <div class="layui-input-block">
											      <input type="text" name="contactsTelephone" id="dianhua"  lay-verify="phone" placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			</div>
						    		</div>	
						    		<div class="layui-row people-contact">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">微信</label>
											    <div class="layui-input-block">
											      <input type="text" name="wechat" id="weixin"    placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			</div>
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">邮箱</label>
											    <div class="layui-input-block">
											      <input type="text" name="mailbox" id="youxiang"  placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			
						    			</div>
						    		</div>	
						    		<div class="layui-row people-agent hide" >
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label"><span class="must-fill">*</span>代理人</label>
											    <div class="layui-input-block">
											      <input type="text" name="agentName" id="agentName"    placeholder="" autocomplete="off" class="layui-input" lay-verify="agentPeople">
											    </div>
											</div>
						    			</div>
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label"><span class="must-fill">*</span>代理人电话</label>
											    <div class="layui-input-block">
											      <input type="text" name="agentTelephone" id="agentTelephone"  placeholder="" autocomplete="off" class="layui-input" lay-verify="agentPhone">
											    </div>
											</div>
						    			
						    			</div>
						    		</div>	
						    </div>
						    <div class="layui-tab-item">
						    <!-- 内容二 -->
						    	<div id="" >
						    		<div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">公司名称</label>
											    <div class="layui-input-block">
											      <input type="text" name="corporateName" id="companyName" lay-verify="companyName" placeholder="" autocomplete="off" class="layui-input">
											    </div>
											</div>
						    			</div>
						    		</div>
						    		<div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">行业</label>
											    <div class="layui-input-block">
											      	<!-- <input type="text" name="fkDicIndustry" id="fkDicIndustry" lay-verify="companyName" placeholder="" autocomplete="off" class="layui-input"> -->
													<select name="fkDicIndustry" id="fkDicIndustry" placeholder="" autocomplete="off" xm-select-skin="normal">
											     	 	<option value="">选择来源</option>
												        <option value="1">北京</option>
												        <option value="2">上海</option>
												   </select>
											    </div>
											</div>
						    			</div>
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">公司类型</label>
											    <div class="layui-input-block">
											      <select name="fkDicCorporateType" id="corporateType" xm-select-skin="normal">
											     	 	<option value="">选择来源</option>
												        <option value="1">北京</option>
												        <option value="2">上海</option>
												   </select>
											    </div>
											</div>
						    			</div>
						    		</div>		
						    	</div>	
						    </div>
						    <div class="layui-tab-item">
						    <!-- 内容三 -->
						       <div class="layui-row">
				    				<div class="layui-form-item">
									    <label class="layui-form-label">客户意向</label>
									    <div class="layui-input-block">
									     	<input type="checkbox" value="1" name="positionRental" title="工位租赁" lay-skin="primary" lay-filter="csmIntention">
									     	<div class="content hide">
									     		<div class="layui-form-item">
												    <label class="layui-form-label">工位类型</label>
												    <div class="layui-input-block">
												        <input type="checkbox" name="fkDicPositionType" value="0" title="开放工位" lay-skin="primary">
												        <input type="checkbox" name="fkDicPositionType" value="1" title="独立办公间" lay-skin="primary">
												        <input type="checkbox" name="fkDicPositionType" value="2" title="灵活办公区" lay-skin="primary">
												        <input type="checkbox" name="fkDicPositionType" value="3" title="灵活工位" lay-skin="primary">
												    </div>
												    <div class="layui-input-block">
												        <input type="radio" name="rentingStyle" value="0" title="按面积出租" lay-filter="rentingStyle">
												        <input type="radio" name="rentingStyle" value="1" title="按工位出租" lay-filter="rentingStyle">
												    </div>
												    
												</div>	
												<div class="layui-form-item">
													<div class="layui-inline hide" id="liveP">
													    <label class="layui-form-label">入驻人数</label>
													    <div class="layui-input-inline">
													    	<select name="residentNumber" xm-select-skin="normal">
														   		<option value=""></option>
														   	</select>
													    </div>
													 </div>	
													 <div class="layui-inline hide" id="leaseArea">
													    <label class="layui-form-label">租赁面积</label>
													    <div class="layui-input-inline">
													    	<select name="area" xm-select-skin="normal">
													    		<option value=""></option>
													     	 	<option value="0">1-10</option>
														        <option value="1">11-20</option>
														        <option value="2">21-50</option>
														        <option value="3">51-100</option>
														        <option value="4">101-200</option>
														        <option value="5">200以上</option>
														   </select>
													    </div>
													 </div>			
													<div class="layui-inline">
													    <label class="layui-form-label">入驻月数</label>
													    <div class="layui-input-inline">
													    	<select name="residentMonths" xm-select-skin="normal">
													     	 	<option value=""></option>
														   </select>
													    </div>
													 </div>		
												</div>		
									     	</div>
									    </div>
									    <div class="layui-input-block">
											<input type="checkbox" name="fieldRental" value="1" title="场地租赁" lay-skin="primary" lay-filter="csmIntention">
											<div class="content hide">
												<div class="layui-form-item">
												    <label class="layui-form-label">容纳人数</label>
												    <div class="layui-input-inline">
												      <select name="capacity" xm-select-skin="normal">
												     	 	<option value=""></option>
													   </select>
												    </div>
												</div>
											</div> 
										</div>
										<div class="layui-input-block">
											<input type="checkbox" name="other" value="1" title="其它" lay-skin="primary" lay-filter="csmIntention">
											<div class="content hide">
												<div class="layui-form-item">
												    <label class="layui-form-label">具体信息</label>
												    <div class="layui-input-inline">
												       <textarea name="specificInformation" placeholder="请输入" class="layui-textarea" style="width:400px;height:120px"></textarea>
												    </div>
												</div>
											</div> 
									    </div>
									</div>		
						       </div>		
						       <div class="layui-row">
				    				<div class="layui-form-item">
									    <label class="layui-form-label">意向分店</label>
									    <div class="layui-input-block">
									      <select name="intentionShop" id="intentionShop" xm-select-skin="normal">
									     	 	<option value="">选择感兴趣的分店</option>
										        <option value="1">北京</option>
										        <option value="2">上海</option>
										   </select>
									    </div>
									</div>		
						    	</div>		
						    	<div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label">入驻意愿</label>
											    <div class="layui-input-block">
											      <input type="radio" name="admissionDesire" value="0" title="很强烈" >
											      <input type="radio" name="admissionDesire" value="1" title="一般"  >
											      <!-- <input type="radio" name="admissionDesire" value="2" title="不强烈" > -->
											    </div>
											</div>
						    			</div>
								 </div>
						    	 <div class="layui-row">
						    			<div class="layui-col-sm6 layui-col-md6 ">
						    				<div class="layui-form-item">
											    <label class="layui-form-label"><span class="must-fill">*</span>客户来源</label>
											    <div class="layui-input-block">
											      <input type="radio" name="customerSource" value="0" title="线上" lay-filter="csmSource" lay-verify="csmSource">
											      <input type="radio" name="customerSource" value="1" title="中介"  lay-filter="csmSource">
											      <input type="radio" name="customerSource" value="2" title="社交网络"  lay-filter="csmSource">
											      <input type="radio" name="customerSource" value="3" title="推荐"  lay-filter="csmSource">
											    </div>
											</div>
						    			</div>
						    	</div>
						    	<div class="layui-row">
				    				<div class="layui-form-item">
									    <label class="layui-form-label">具体来源</label>
									    <div class="layui-input-block">
									      <input type="text" name="specificSource" placeholder="" autocomplete="off" class="layui-input">
									    </div>
									</div>
						    	</div>
						    </div>
						    <div class="layui-tab-item ">
						    <!-- 内容四 -->
						    	 <div class="layui-row">
					    			<div class="layui-col-sm6 layui-col-md6">
					    				<div class="layui-form-item">
										    <label class="layui-form-label" style="width:120px"><span class="must-fill">*</span>选择客户状态</label>
										    <div class="layui-input-block" style="margin-left:165px">
										      <input type="radio" name="customerState" value="0" title="初步接洽" lay-filter="csmState" lay-verify="csmState">
										      <input type="radio" name="customerState" value="1" title="赢单 "  lay-filter="csmState">
										      <input type="radio" name="customerState" value="2" title="流失   "  lay-filter="csmState">
										    </div>
										</div>
					    			</div>
						    	</div>
						    	<div class="flow-communicate hide">
						    		<div class="communicate-arrow" style="display: inline-block; left: 200px;"><em></em><span></span></div>
					    			<div class="layui-form-item">
									    <label class="layui-form-label"><span class="must-fill">*</span>销售记录</label>
									    <div class="layui-input-block">
									       <textarea name="sellInfo" placeholder="请填写销售记录" lay-verify="saleRecord" class="layui-textarea" style="height:68px"></textarea>
									    </div>
									</div>
									<div class="layui-form-item">
									    <label class="layui-form-label"><span class="must-fill">*</span>沟通方式</label>
									    <div class="layui-input-block">
									      <input type="radio" name="communicateMode" checked="checked" value="0" title="顾客上门" lay-filter="linkType">
									      <input type="radio" name="communicateMode" value="1" title="电话通讯 "  lay-filter="linkType">
									      <input type="radio" name="communicateMode" value="2" title="发送邮件   "  lay-filter="linkType">
									      <input type="radio" name="communicateMode" value="1" title="微信沟通 "  lay-filter="linkType">
									      <input type="radio" name="communicateMode" value="2" title="QQ沟通   "  lay-filter="linkType">
									      <input type="radio" name="communicateMode" value="2" title="其他 "  lay-filter="linkType">
									    </div>
									</div>
									<div class="layui-form-item">
									    <label class="layui-form-label"><span class="must-fill">*</span>是否参观</label>
										    <div class="layui-input-block">
											      <input type="radio" name="visit" value="0" title="客户已参观" lay-filter="visitFleg">
											      <div class="visit-choice-container hide mag-bot-20"><!-- 是否参观 -->
											      		<div class="layui-row">
						    								<div class="layui-form-item">
															    <div class="layui-input-inline" style="width: 240px;">
															      <select name="fkProjectid" id="fkProjectid" xm-select-skin="normal">
															     	 	<option value="">选择分店</option>
																   </select>
															    </div>
															    <div class="layui-input-inline" style="width: 240px;">
															        <select name="visitUser" id="visitUser" xm-select-skin="normal">
															     	 	<option value="">选择带领人</option>
																   	</select>
															    </div>
															    <div class="layui-input-inline" style="width: 240px;">
															        <input type="text" name="visitDate" id="visitDate" readonly='readonly' autocomplete="off" class="layui-input date-input" placeholder="选择创建日期">	
															    </div>
															</div>		
							    						</div>
											      		<div class="layui-row">
											      			 <input type="text" name="visitRemarks" autocomplete="off" class="layui-input layui-input-inline" placeholder="备注" style="width: 720px;">	
											      			 <button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="addVisit" >添加</button>
											      		</div>
											      		<!-- 存放客户参观信息 -->
											      		<div class="layui-row visitList">
											      		</div>
											      </div>
										     </div>
										     <div class="layui-input-block">
											      <input type="radio" name="visit" value="1" title="客户预约参观 "  lay-filter="visitFleg">
											      <div class="visit-choice-container hide mag-bot-20">
											      		<div class="layui-row">
												      		<div class="layui-form-item">
												      			<div class="layui-input-inline" style="width: 240px;">
																      <input type="text" name="subVisitDate" id="subVisitDate"  autocomplete="off" class="layui-input date-input" placeholder="选择创建日期">	
																</div>
												      		</div>
											      		</div>
											      </div>
										     </div>
										     <div class="layui-input-block">
										     	<input type="radio" name="visit" value="2" title="客户未参观   " checked="checked" lay-filter="visitFleg">
										     </div>
									</div>
						    		<div class="layui-form-item itemChange start-item loss-item">
									    <label class="layui-form-label">可对比竞品</label>
									    <div class="layui-input-block">
									      <input type="text" name="contrastive"  placeholder="" autocomplete="off" class="layui-input">
									    </div>
						    		</div>
						    		<div class="layui-form-item itemChange start-item">
										    <label class="layui-form-label">下次跟进</label>
										    <div class="layui-input-block">
										      <input type="text" name="nextTimDate" readonly='readonly' id="nextTimDate"  placeholder="" autocomplete="off" class="layui-input date-input">
										    </div>
						    		</div>
						    		<div class="layui-form-item itemChange win-item hide">
										    <label class="layui-form-label"><span class="must-fill">*</span>赢单分店</label>
										    <div class="layui-input-block">
											      <select name="winProjectid" id="winProjectid" xm-select-skin="normal">
										     	 	<option value="">选择赢单的分店</option>
											        <option value="1">北京</option>
											        <option value="2">上海</option>
											      </select>
										    </div>
						    		</div>
						    		<div class="layui-form-item itemChange loss-item hide">
										    <label class="layui-form-label"><span class="must-fill">*</span>流失原因</label>
										    <div class="layui-input-block">
											      <select name="fkDicCauseLoss" id="fkDicCauseLoss">
										     	 	<option value="">请选择</option>
											        <option value="1">北京</option>
											        <option value="2">上海</option>
											      </select>
										    </div>
						    		</div>
						    		<!-- <div class="layui-form-item">
						    			<span class="layui-btn layui-btn-normal btn-bg f-right " id="save-btn">保存销售记录</span>
						    		</div> -->
						    	</div>
						    </div>
						    <div class="layui-tab-item">
						    	<div class="layui-form-item">
								    <label class="layui-form-label"><span class="must-fill">*</span>执行人</label>
								    <div class="layui-input-block">
									      <select name="executor" id="executor" lay-verify="executorV" xm-select-skin="normal">
								     	 	<option value="">选择赢单的分店</option>
									        <option value="1">北京</option>
									        <option value="2">上海</option>
									      </select>
								    </div>
						    	</div>
						    	<div class="layui-form-item">
								    <label class="layui-form-label">团队人员</label>
								    <div class="layui-input-block">
									      <select name="teamStaffList" id="teamStaffList" xm-select="team" xm-select-skin="normal">
								     	 	<option value="">选择赢单的分店</option>
									        <option value="1">北京</option>
									        <option value="2">上海</option>
									      </select>
								    </div>
						    	</div>
						    	<div class="layui-form-item">
								    <label class="layui-form-label">备注</label>
								    <div class="layui-input-block">
									       <textarea name="remarks" placeholder="请输入" class="layui-textarea" style="height:120px"></textarea>
									       <span style="color: rgb(153, 153, 153); font-size: 12px; padding: 4px 0px 0px;">备注信息内部可见</span>
								    </div>
						    	</div>
						    </div>
						    <button id="submit-btn" class="hide" lay-submit lay-filter="clientForm"></button>
						</form>
					</div>
				</div>
				<div class="cop-btn clearfix" style="width:100%;position:absolute;left:0px;bottom: 20px;padding:0px 20px 10px;box-sizing:border-box">
		    		<button type="button" class="layui-btn layui-btn-normal btn-bg f-left hide">上一步</button>
		    		<button type="button" class="layui-btn layui-btn-normal btn-bg f-right">下一步</button>
				</div>
			</section>
		</div>
	</div>
<script>
$(function() {
	var isVerify = true;
	var visitList = new Array(); //用来保存参观信息
	//初始化入住人数,初始化入住月数,容纳人数
	var rn = $("select[name='residentNumber'],select[name='residentMonths'],select[name='capacity']");
	for (var i = 1; i <= 50; i++) {
		rn.append("<option value=\"" + i + "\">" + i + "</option>");
	}

	//layui部分
	layui.config({
		base: '/js/plugin/layui-v2.3.0/layui/' //此处路径请自行处理, 可以使用绝对路径
	}).extend({
		formSelects: 'formSelects-v3'
	}).use(['element', "layer", "form", 'formSelects', 'laydate'],
	function() {
		var layer = layui.layer,
		form = layui.form,
		formSelects = layui.formSelects,
		laydate = layui.laydate;

		//select2 赋值
		initFormSelects("corporateType", "/system/data-dic/selectjson/dic_corporate_type"); //公司类型 
		initFormSelects("fkDicCauseLoss", "/system/data-dic/selectjson/dic_customer_loss"); //流失原因
		initFormSelects("fkDicIndustry", "/system/data-dic/selectjson/dic_customer_industry"); //行业 
		initFormSelectsExt({ //分店
			id: "intentionShop,#fkProjectid,#winProjectid",
			url: "/app/customerInfo/getProjectJson",
			first: "请选择分店"
		});
		initFormSelectsExt({ //带领人
			id: "visitUser",
			url: "/system/org/user/selectjson",
			first: "请选择带领人"
		});
		initFormSelectsExt({ //执行人和团队人员
			id: "teamStaffList,#executor",
			url: "/system/org/user/selectjson"
		});

		//初始化日期插件
		laydate.render({
			elem: '#nextTimDate', //下次跟进
			btns: ['now', 'confirm'],
			value:new Date()
		});
		laydate.render({
			elem: '#visitDate' //参观时间
			,
			btns: ['now', 'confirm'],
			value: new Date()
		});
		laydate.render({
			elem: '#subVisitDate' //预约参观时间
		});

		form.verify({
			userName: function(value, item) { //value：表单的值、item：表单的DOM对象
				if ($(item).is(':visible') && value == "") {
					isVerify = false;
					return '客户名称不能为空';
				}
			},
			saleRecord: function(value, item) {
				if ($(item).is(':visible') && value == "") {
					isVerify = false;
					return '销售记录不能为空';
				}
			},
			peopleName: function(value, item) {
				if ($(item).is(':visible') && value == "") {
					isVerify = false;
					return '联系人不能为空';
				}
			},
			phone: function(value, item) {
				var dianhua = $("#dianhua").val();
				var weixin = $("#weixin").val();
				var youxiang = $("#youxiang").val();
				if ($(item).is(':visible') && dianhua == "" && weixin == "" && youxiang == "") {
					isVerify = false;
					return "电话，微信，邮箱必须填写一项。";
				}
			},
			agentPeople: function(value, item) {
				if ($(item).is(':visible') && value == "") {
					isVerify = false;
					return '代理人不能为空';
				}
			},
			agentPhone: function(value, item) {
				if ($(item).is(':visible') && value == "") {
					isVerify = false;
					return '代理人电话不能为空';
				}
			},
			csmSource: function(value, item) {
				var parnets = $(item).parents(".layui-tab-item");
				if ($(parnets).is(':visible')) {
					var val = $('input:radio[name="customerSource"]:checked').val();
					if (val == null) {
						isVerify = false;
						return '请选择客户来源';
					}
				}
			},
			executorV: function(value, item) {
				if (index == 4 && value == "") {
					isVerify = false;
					return '执行人不能为空';
				}
			}
		});

		//监听提交
		form.on('submit(clientForm)',function(data) {
			if (index == 4) { //代表最后一个页  可提交到服务器了
				var selVal = formSelects.value('team', 'valStr'); //获取团队人员多选下拉的值
				var checkVal = "";
				var $t = $("input[name='fkDicPositionType']:checked");
				$.each($t,function(i, v) {
					checkVal += $(v).val() + ",";
				});
				data.field.fkDicPositionType = checkVal; //工位类型
				//封装参观记录对象 以方便json序列化
				data.field.sellRecord = {
					customerState: data.field.customerState,
					//客户状态
					sellInfo: data.field.sellInfo,
					//销售记录
					communicateMode: data.field.communicateMode,
					//沟通方式
					visit: data.field.visit,
					//是否参观
					contrastive: data.field.contrastive,
					//可对比竞品
					nextTimDate: data.field.nextTimDate,
					//下次跟进时间
					winProjectid: data.field.winProjectid,
					//赢单分店
					fkDicCauseLoss: data.field.fkDicCauseLoss //流失原因
				};
				$.post("/app/customerInfo/addCustomer", {
					cusJson: JSON.stringify(data.field),
					teamStaff: selVal,
					visitList: JSON.stringify(visitList)
				},
				function(data) {
					layer.msg(data.error, {
						icon: 1,
						shade: [0.3, '#393D49']
					},function(){
						location.href="/app/customerInfo/list";
					});
				},
				'json');
			}
			return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
		});
		//选择客户类型
		form.on('radio(usertype)',function(data) {
			if (data.value == 1) {
				$("#client-form .layui-tab-item").eq(0).children('.layui-row.people-contact').addClass("hide");
				$("#client-form .layui-tab-item").eq(0).children('.layui-row.people-agent').removeClass("hide");
			} else {
				$("#client-form .layui-tab-item").eq(0).children('.layui-row.people-contact').removeClass("hide");
				$("#client-form .layui-tab-item").eq(0).children('.layui-row.people-agent').addClass("hide");
			}
		});
		//选择客户意向
		form.on('checkbox(csmIntention)',function(data) {
			var fleg = data.elem.checked;
			fleg ? $(data.othis).next(".content").removeClass("hide") : $(data.othis).next(".content").addClass("hide");
		});
		//出租方式；
		form.on('radio(rentingStyle)',function(data) {
			if (data.value == 1) {
				$("#liveP").removeClass("hide");
				$("#leaseArea").addClass("hide");
			} else {
				$("#leaseArea").removeClass("hide");
				$("#liveP").addClass("hide");
			}
		});
		//选择是否参观
		form.on('radio(visitFleg)',function(data) {
			if (data.value == 1 || data.value == 0) {
				$('.visit-choice-container').addClass("hide").eq(data.value).removeClass("hide")
			}
		});
		//选择客户状态
		form.on('radio(csmState)',function(data) {
			$(".cop-btn button").eq(1).removeClass("hide");//显示下一步
			$(".flow-communicate").removeClass("hide");
			$(".flow-communicate .itemChange").addClass("hide");
			if (data.value == 0) {
				$(".flow-communicate .start-item ").removeClass("hide");
				$(".communicate-arrow").css("left", "200px")
			} else if (data.value == 1) {
				$(".flow-communicate .win-item ").removeClass("hide");
				$(".communicate-arrow").css("left", "300px")
			} else {
				$(".flow-communicate .loss-item ").removeClass("hide");
				$(".communicate-arrow").css("left", "380px")
			}
		});
	});
	//下一步上一步的按钮
	var index = 0; //当前页索引
	$(".cop-btn").on("click", "button",function() {
		var indexBtn = $(this).index();
		if (indexBtn == 0 && index > 0) { //上一页
			index--;
			if (index == 0) {
				$(".cop-btn button").eq(0).addClass("hide");
			}
			$(".cop-btn button").eq(1).removeClass("hide");
		} else if (index <= 4) { //下一页
			//提交表单 触发验证
			$("#submit-btn").click();
			if (index == 4) { //等于4代表最后一个页面 应该提交该页面  不需要后续操作
				return;
			}
			if (isVerify) {
				index++;
				if (index == 3) { //三这个页面特殊
					$(".cop-btn button").eq(1).addClass("hide");
				} else {
					$(".cop-btn button").removeClass("hide");
				}
			} else { //该页验证没通过则什么都不执行
				isVerify = true;
				return;
			}
		}
		if (index >= 0 && index <= 4) {
			//展示指定标签页
			$("#client-form .layui-tab-item").removeClass("layui-show").eq(index).addClass("layui-show");
			//设置进度条长度 一共五个页面一个百分之20
			$(".crm-new-opp-progress-bar").width("" + (index + 1) * 20 + '%' + "");
			if (index == 4) {
				$("button.f-right").text("保存");
			} else {
				$("button.f-right").text("下一步");
			}
		}
	});
	//保存销售记录
	/* $("#save-btn").on("click",function() {
		$(".cop-btn button").eq(1).removeClass("hide");
	}) */
	//弹出框
	$("#add-disc").on("click",function() {
		layer.open({
			title: ['角色信息', 'font-size:18px;text-align:center;padding:0'],
			type: 2,
			area: ['600px', '316px'],
			shade: [0.8, '#393D49'],
			content: ["/orgrole/toadd", 'no']
		});
	});

	//添加客户参观信息
	$("#addVisit").click(function() {
		var v1 = $("select[name='fkProjectid']"); //参观分店 option:selected
		var v2 = $("select[name='visitUser']"); //参观带领人
		var v3 = $("input[name='visitDate']"); //参观日期
		var v4 = $("input[name='visitRemarks']"); //参观备注
		var visit = { //添加到集合中  用来提交表单到后台
			fkProjectid: v1.val(),
			visitUser: v2.val(),
			visitDate: v3.val(),
			visitRemarks: v4.val()
		};
		if (pushProject(visit)) { //添加参观展示信息
			$("div.visitList").append("<div class='layui-inline'>" + v1.find("option:selected").text() + "</br>" + v2.find("option:selected").text() + "</div>");
		}
	});

	//插入参观数据 如果不存在这插入返回true否则相反
	function pushProject(visit) {
		if (visit.fkProjectid == "" || visit.visitUser == "") {
			layer.msg('分店和代理人必填', {
				icon: 5
			});
			return false;
		}
		for (var i = 0; i < visitList.length; i++) {
			if (visit.fkProjectid == visitList[i].fkProjectid) { //如果已经存在则插入失败
				layer.msg('分店已存在,请选择其它分店', {
					icon: 5
				});
				return false;
			}
		}
		visitList.push(visit);
		return true;
	}
});
</script>
</body>
</html>